<template>
  <div>
    <el-card>
      <el-row :gutter="10" class="flex flex-wrap">
        <!-- 渠道信息 -->
        <el-col :sm="8" :md="4" :lg="4" v-if="verifyShow.extChannel">
          <el-card>
            <div slot="header" class="clearfix relative">
              <span class="title-icon">渠道信息</span>
              <el-button
                v-if="verifyShow.extChannelEdit"
                type="success"
                size="mini"
                class="header-save-btn"
                @click="changeChannelInfo"
              >
                {{ isChangeChannelInfo ? "保存" : "编辑" }}
              </el-button>
            </div>

            <el-form
              size="mini"
              label-position="left"
              label-width="80px"
              class="main-text"
              style="height:425px;"
              :model="channelInfo"
            >
              <el-form-item prop="masterNumber">
                <div slot="label">主单号：</div>
                <el-input
                  v-if="isChangeChannelInfo"
                  v-model="channelInfo.masterNumber"
                  clearable
                />
                <span v-else>{{ channelInfo.masterNumber }}</span>
              </el-form-item>
              <!-- <span>目的国家:</span> -->
              <el-form-item prop="countryId">
                <div slot="label">目的国家：</div>
                <el-select
                  v-if="isChangeChannelInfo"
                  v-model="channelInfo.countryId"
                  placeholder="请选择国家"
                  clearable
                  filterable
                >
                  <el-option
                    v-for="(k, v) in countryOptions"
                    :key="k"
                    :label="v"
                    :value="parseInt(k)"
                  ></el-option>
                </el-select>
                <span v-else>{{
                  findKey(channelInfo.countryId + "", countryOptions)
                }}</span>
              </el-form-item>
              <el-form-item prop="palceOrderWay">
                <div slot="label">渠道：</div>
                <el-select
                  v-if="isChangeChannelInfo"
                  v-model="channelInfo.palceOrderWay"
                  placeholder="请选择渠道"
                  clearable
                  filterable
                >
                  <el-option
                    v-for="(k, v) in palceOrderWayOptions"
                    :key="k"
                    :label="palceOrderWayOptions[v]"
                    :value="parseInt(v)"
                  ></el-option>
                </el-select>
                <span v-else>{{
                  palceOrderWayOptions[channelInfo.palceOrderWay]
                }}</span>
              </el-form-item>

              <el-form-item prop="inStockActualWeight">
                <div slot="label">实重(KG):</div>
                <el-input
                  v-if="isChangeChannelInfo"
                  v-model="channelInfo.inStockActualWeight"
                  clearable
                />
                <span v-else>{{ channelInfo.inStockActualWeight }}</span>
              </el-form-item>
              <el-form-item prop="inStockVolume">
                <div slot="label">体积(CBM):</div>
                <el-input
                  v-if="isChangeChannelInfo"
                  v-model="channelInfo.inStockVolume"
                  clearable
                />
                <span v-else>{{ channelInfo.inStockVolume }}</span>
              </el-form-item>

              <el-form-item prop="inStockChargedWeight">
                <div slot="label">计费重:</div>
                <el-input
                  v-if="isChangeChannelInfo"
                  v-model="channelInfo.inStockChargedWeight"
                  clearable
                />
                <span v-else>{{ channelInfo.inStockChargedWeight }}</span>
              </el-form-item>
              <el-form-item prop="inStockTotalPackages" style="height:50px;">
                <div slot="label">件数:</div>
                <el-input
                  v-if="isChangeChannelInfo"
                  v-model="channelInfo.inStockTotalPackages"
                  clearable
                />
                <span v-else>{{ channelInfo.inStockTotalPackages }}</span>
              </el-form-item>
            </el-form>
          </el-card>
        </el-col>

        <!-- 出库信息 -->
        <el-col :sm="8" :md="4" :lg="4" v-if="verifyShow.extOutStock">
          <el-card>
            <div slot="header" class="clearfix relative">
              <span class="title-icon">出库信息</span>
              <el-button
                v-if="verifyShow.extOutStockEdit"
                type="success"
                size="mini"
                class="header-save-btn"
                @click="changeOutOfStockInfo"
              >
                {{ isChangeOutStockInfo ? "保存" : "编辑" }}
              </el-button>
            </div>
            <el-form
              size="mini"
              label-position="left"
              label-width="80px"
              class="main-text"
              style="height:425px;"
            >
              <el-form-item prop="serviceTotalPackages">
                <div slot="label">件数:</div>
                <el-input
                  v-if="isChangeOutStockInfo"
                  v-model="outStockInfo.serviceTotalPackages"
                  clearable
                />
                <span v-else>{{ outStockInfo.serviceTotalPackages }}</span>
              </el-form-item>
              <el-form-item prop="serviceActualWeight">
                <div slot="label">实重:</div>
                <el-input
                  v-if="isChangeOutStockInfo"
                  v-model="outStockInfo.serviceActualWeight"
                  clearable
                />
                <span v-else>{{ outStockInfo.serviceActualWeight }}</span>
              </el-form-item>
              <el-form-item prop="serviceChargedWeight">
                <div slot="label">计费重:</div>
                <el-input
                  v-if="isChangeOutStockInfo"
                  v-model="outStockInfo.serviceChargedWeight"
                  clearable
                />
                <span v-else>{{ outStockInfo.serviceChargedWeight }}</span>
              </el-form-item>
              <el-form-item prop="serviceVolume">
                <div slot="label">体积:</div>
                <el-input
                  v-if="isChangeOutStockInfo"
                  v-model="outStockInfo.serviceVolume"
                  clearable
                />
                <span v-else>{{ outStockInfo.serviceVolume }}</span>
              </el-form-item>
              <el-form-item prop="serviceVolumeWeight">
                <div slot="label">体积重:</div>
                <el-input
                  v-if="isChangeOutStockInfo"
                  v-model="outStockInfo.serviceVolumeWeight"
                  clearable
                />
                <span v-else>{{ outStockInfo.serviceVolumeWeight }}</span>
              </el-form-item>
              <el-form-item prop="serviceUnitPrice">
                <div slot="label">单价:</div>
                <el-input
                  v-if="isChangeOutStockInfo"
                  v-model="outStockInfo.serviceUnitPrice"
                  clearable
                />
                <span v-else>{{ outStockInfo.serviceUnitPrice }}</span>
              </el-form-item>
              <el-form-item prop="serviceUnitPriceCurrency">
                <div slot="label">币种:</div>

                <el-select
                  v-if="isChangeOutStockInfo"
                  v-model="channelInfo.serviceUnitPriceCurrency"
                  placeholder="请选择币种"
                  filterable
                >
                  <el-option
                    v-for="(k, v) in currencyOptions"
                    :key="k"
                    :label="currencyOptions[v]"
                    :value="v"
                  ></el-option>
                </el-select>
                <span v-else>{{
                  currencyOptions[outStockInfo.serviceUnitPriceCurrency]
                }}</span>
              </el-form-item>
            </el-form>
          </el-card>
        </el-col>
        <!-- 订舱信息 -->
        <el-col :sm="32" :md="16" :lg="16" v-if="verifyShow.extDing">
          <el-card>
            <div slot="header" class="clearfix relative">
              <span class="title-icon">订舱信息</span>
              <el-button
                v-if="verifyShow.extDingEdit"
                type="success"
                size="mini"
                class="header-save-btn"
                @click="changeStockInfo"
              >
                {{ isChangeProtInfo ? "保存" : "编辑" }}
              </el-button>
            </div>
            <el-form
              size="mini"
              label-position="left"
              label-width="120px"
              class="main-text"
              style="height:425px;"
            >
              <el-row :gutter="10">
                <el-col :md="12" :lg="8">
                  <el-form-item prop="shipmentPort">
                    <div slot="label">起运港：</div>

                    <el-select
                      v-if="isChangeProtInfo"
                      v-model="protInfo.shipmentPort"
                      placeholder="请选择起运港"
                      filterable
                    >
                      <el-option
                        v-for="(k, v) in configPortOptions"
                        :key="k"
                        :label="configPortOptions[v]"
                        :value="parseInt(v)"
                      ></el-option>
                    </el-select>

                    <span v-else>{{
                      configPortOptions[protInfo.shipmentPort]
                    }}</span>
                  </el-form-item>
                </el-col>
                <el-col :md="12" :lg="8">
                  <el-form-item prop="departurePortInspectionTime">
                    <div slot="label">起运港查验时间：</div>
                    <el-date-picker
                      v-if="isChangeProtInfo"
                      value-format="yyyy-MM-dd"
                      v-model="protInfo.departurePortInspectionTime"
                      type="date"
                      placeholder="选择日期"
                      :style="{ width: '100%' }"
                      :picker-options="pickerOptions"
                    >
                      >
                    </el-date-picker>

                    <span v-else>{{
                      protInfo.departurePortInspectionTime
                    }}</span>
                  </el-form-item>
                </el-col>
                <el-col :md="12" :lg="8">
                  <el-form-item prop="departurePortInspectionReason">
                    <div slot="label">起运港查验原因：</div>

                    <el-input
                      v-if="isChangeProtInfo"
                      v-model="protInfo.departurePortInspectionReason"
                      clearable
                    />
                    <span v-else>{{
                      protInfo.departurePortInspectionReason
                    }}</span>
                  </el-form-item>
                </el-col>
                <el-col :md="12" :lg="8">
                  <el-form-item prop="destinationPort">
                    <div slot="label">目的港：</div>
                    <el-select
                      v-if="isChangeProtInfo"
                      v-model="protInfo.destinationPort"
                      placeholder="请选择目的港"
                      filterable
                    >
                      <el-option
                        v-for="(k, v) in configPortOptions"
                        :key="k"
                        :label="configPortOptions[v]"
                        :value="parseInt(v)"
                      ></el-option>
                    </el-select>

                    <span v-else>{{
                      configPortOptions[protInfo.destinationPort]
                    }}</span>
                  </el-form-item>
                </el-col>
                <el-col :md="12" :lg="8">
                  <el-form-item prop="arrivalPortInspectionTime">
                    <div slot="label">目的港查验时间:</div>
                    <el-date-picker
                      v-if="isChangeProtInfo"
                      v-model="protInfo.arrivalPortInspectionTime"
                      type="date"
                      value-format="yyyy-MM-dd"
                      placeholder="选择日期"
                      :style="{ width: '100%' }"
                      :picker-options="pickerOptions"
                    >
                      >
                    </el-date-picker>

                    <span v-else>{{ protInfo.arrivalPortInspectionTime }}</span>
                  </el-form-item>
                </el-col>
                <el-col :md="12" :lg="8">
                  <el-form-item prop="arrivalPortInspectionReason">
                    <div slot="label">目的港查验原因:</div>

                    <el-input
                      v-if="isChangeProtInfo"
                      v-model="protInfo.arrivalPortInspectionReason"
                      clearable
                    />
                    <span v-else>{{
                      protInfo.arrivalPortInspectionReason
                    }}</span>
                  </el-form-item>
                </el-col>
                <el-col :md="12" :lg="8">
                  <el-form-item prop="transferPort">
                    <div slot="label">中转港:</div>
                    <el-select
                      v-if="isChangeProtInfo"
                      v-model="protInfo.transferPort"
                      placeholder="请选择目的港"
                      filterable
                    >
                      <el-option
                        v-for="(k, v) in configPortOptions"
                        :key="k"
                        :label="configPortOptions[v]"
                        :value="parseInt(v)"
                      ></el-option>
                    </el-select>

                    <span v-else>{{
                      configPortOptions[protInfo.transferPort]
                    }}</span>
                  </el-form-item>
                </el-col>
                <!-- <el-col :md="12" :lg="8">
                  <el-form-item prop="transferPortInspectionTime">
                    <div slot="label">中转港查验时间:</div>
                    <el-date-picker
                      v-if="isChangeProtInfo"
                      v-model="protInfo.transferPortInspectionTime"
                      type="date"
                      value-format="yyyy-MM-dd"
                      placeholder="选择日期"
                      :style="{ width: '100%' }"
                      :picker-options="pickerOptions"
                    >
                      >
                    </el-date-picker>

                    <span v-else>{{
                      protInfo.transferPortInspectionTime
                    }}</span>
                  </el-form-item>
                </el-col> -->
                <!-- <el-col :md="12" :lg="8">
                  <el-form-item prop="transferPortInspectionReason">
                    <div slot="label">中转港查验原因:</div>

                    <el-input
                      v-if="isChangeProtInfo"
                      v-model="protInfo.transferPortInspectionReason"
                      clearable
                    />
                    <span v-else>{{
                      protInfo.transferPortInspectionReason
                    }}</span>
                  </el-form-item>
                </el-col> -->
                <el-col :md="12" :lg="8">
                  <el-form-item prop="serviceCompanyId">
                    <div slot="label">服务商:</div>
                    <el-select
                      v-if="isChangeProtInfo"
                      v-model="protInfo.serviceCompanyId"
                      placeholder="请选择服务商"
                      clearable
                      :style="{ width: '100%' }"
                      filterable
                      @change="companyIdChange"
                    >
                      <el-option
                        v-for="(k, v) in serviceCompanyOptions"
                        :key="k"
                        :label="serviceCompanyOptions[v]"
                        :value="parseInt(v)"
                      ></el-option>
                    </el-select>

                    <span v-else>{{
                      serviceCompanyOptions[protInfo.serviceCompanyId]
                    }}</span>
                  </el-form-item>
                </el-col>
                <el-col :md="12" :lg="8">
                  <el-form-item prop="customsClearanceAgent">
                    <div slot="label">清关服务商:</div>
                    <el-select
                      v-if="isChangeProtInfo"
                      v-model="protInfo.customsClearanceAgent"
                      placeholder="请选择清关服务商"
                      clearable
                      :style="{ width: '100%' }"
                      filterable
                    >
                      <el-option
                        v-for="(k, v) in serviceCompanyOptions"
                        :key="k"
                        :label="serviceCompanyOptions[v]"
                        :value="parseInt(v)"
                      ></el-option>
                    </el-select>

                    <span v-else>{{
                      serviceCompanyOptions[protInfo.customsClearanceAgent]
                    }}</span>
                  </el-form-item>
                </el-col>
                <el-col :md="12" :lg="8">
                  <el-form-item prop="linkMan">
                    <div slot="label">联系人:</div>

                    <el-input
                      v-if="isChangeProtInfo"
                      disabled="true"
                      v-model="protInfo.linkMan"
                      clearable
                    />
                    <span v-else>{{ protInfo.linkMan }}</span>
                  </el-form-item>
                </el-col>
                <el-col :md="12" :lg="8">
                  <el-form-item prop="companyPhone">
                    <div slot="label">电话:</div>
                    <el-input
                      v-if="isChangeProtInfo"
                      disabled="true"
                      v-model="protInfo.companyPhone"
                      clearable
                    />
                    <span v-else>{{ protInfo.companyPhone }}</span>
                  </el-form-item>
                </el-col>
                <el-col :md="12" :lg="8">
                  <el-form-item prop="estimatedArrivalTime">
                    <div slot="label">预计到港时间:</div>
                    <el-date-picker
                      v-if="isChangeProtInfo"
                      v-model="protInfo.estimatedArrivalTime"
                      type="date"
                      value-format="yyyy-MM-dd HH:mm:ss"
                      placeholder="选择日期"
                      :style="{ width: '100%' }"
                      :picker-options="pickerOptions"
                    >
                      >
                    </el-date-picker>

                    <span v-else>{{ protInfo.estimatedArrivalTime }}</span>
                  </el-form-item>
                </el-col>
                <el-col :md="12" :lg="8">
                  <el-form-item prop="estimatedDepartureTime">
                    <div slot="label">预计离港时间:</div>
                    <el-date-picker
                      v-if="isChangeProtInfo"
                      value-format="yyyy-MM-dd HH:mm:ss"
                      v-model="protInfo.estimatedDepartureTime"
                      type="date"
                      placeholder="选择日期"
                      :style="{ width: '100%' }"
                      :picker-options="pickerOptions"
                    >
                      >
                    </el-date-picker>

                    <span v-else>{{ protInfo.estimatedDepartureTime }}</span>
                  </el-form-item>
                </el-col>
                 <el-col :md="12" :lg="8">
                  <el-form-item prop="operationRemark">
                    <div slot="label">操作备注:</div>
                    <el-input
                      v-if="isChangeProtInfo"
                      v-model="protInfo.operationRemark"
                      clearable
                    />
                    <span v-else>{{ protInfo.operationRemark }}</span>
                  </el-form-item>
                </el-col>
                <el-col
                  :md="12"
                  :lg="8"
                  v-if="['seaFreightHD', 'seaFreight'].includes(pageType)"
                >
                  <el-form-item prop="shipOrAirlineCompany">
                    <div slot="label">船公司:</div>
                    <el-select
                      v-if="isChangeProtInfo"
                      v-model="protInfo.shipOrAirlineCompany"
                      placeholder="请选择船公司"
                      filterable
                      clearable
                      :style="{ width: '100%' }"
                    >
                      <el-option
                        v-for="(k, v) in configShipOptions"
                        :key="v"
                        :label="k"
                        :value="parseInt(v)"
                      ></el-option>
                    </el-select>

                    <span v-else>{{
                      configShipOptions[protInfo.shipOrAirlineCompany]
                    }}</span>
                  </el-form-item>
                </el-col>
                <el-col
                  :md="12"
                  :lg="8"
                  v-if="['seaFreightHD', 'seaFreight'].includes(pageType)"
                >
                  <el-form-item prop="bigShip">
                    <div slot="label">大船船只:</div>
                    <el-input
                      v-if="isChangeProtInfo"
                      v-model="protInfo.bigShip"
                      clearable
                    />

                    <span v-else>{{ protInfo.bigShip }}</span>
                  </el-form-item>
                </el-col>
                <el-col
                  :md="12"
                  :lg="8"
                  v-if="['seaFreightHD', 'seaFreight'].includes(pageType)"
                >
                  <el-form-item prop="shipFlights">
                    <div slot="label">大船航次:</div>
                    <el-input
                      v-if="isChangeProtInfo"
                      v-model="protInfo.shipFlights"
                      clearable
                    />

                    <span v-else>{{ protInfo.shipFlights }}</span>
                  </el-form-item>
                </el-col>
                <el-col :md="12" :lg="8" v-if="pageType === 'seaFreight'">
                  <el-form-item prop="shipFlights">
                    <div slot="label">船只IMO:</div>
                    <el-input
                      v-if="isChangeProtInfo"
                      v-model="protInfo.shipImo"
                      clearable
                    />

                    <span v-else>{{ protInfo.shipImo }}</span>
                  </el-form-item>
                </el-col>
                <el-col :md="12" :lg="8" v-if="pageType === 'seaFreightHD'">
                  <el-form-item prop="wharfName">
                    <div slot="label">码头名称:</div>
                    <el-input
                      v-if="isChangeProtInfo"
                      v-model="protInfo.wharfName"
                      clearable
                    />

                    <span v-else>{{ protInfo.shipImo }}</span>
                  </el-form-item>
                </el-col>
                <el-col
                  :md="12"
                  :lg="8"
                  v-if="['airFreightHD', 'airFreight'].includes(pageType)"
                >
                  <el-form-item prop="shipOrAirlineCompany">
                    <div slot="label">航空公司:</div>
                    <el-select
                      v-if="isChangeProtInfo"
                      v-model="protInfo.shipOrAirlineCompany"
                      placeholder="请选择航空公司"
                      clearable
                      :style="{ width: '100%' }"
                      filterable
                    >
                      <el-option
                        v-for="(k, v) in airlineOptions"
                        :key="k"
                        :label="airlineOptions[v]"
                        :value="parseInt(v)"
                      ></el-option>
                    </el-select>

                    <span v-else>{{
                      airlineOptions[protInfo.shipOrAirlineCompany]
                    }}</span>
                  </el-form-item>
                </el-col>
                <el-col
                  :md="12"
                  :lg="8"
                  v-if="['airFreightHD', 'airFreight'].includes(pageType)"
                >
                  <el-form-item prop="flightNumber">
                    <div slot="label">航班号:</div>
                    <el-input
                      v-if="isChangeProtInfo"
                      v-model="protInfo.flightNumber"
                      clearable
                    />
                    <span v-else>{{ protInfo.flightNumber }}</span>
                  </el-form-item>
                </el-col>
                <el-col
                  :md="12"
                  :lg="8"
                  v-if="['seaFreightHD', 'seaFreight'].includes(pageType)"
                >
                  <el-form-item prop="deliveryType">
                    <div slot="label">派送方式:</div>
                    <el-select
                      v-if="isChangeProtInfo"
                      v-model="protInfo.deliveryType"
                      placeholder="请选择派送方式"
                      clearable
                      :style="{ width: '100%' }"
                      filterable
                    >
                      <el-option
                        v-for="(k, v) in deliveryTypeOptions"
                        :key="k"
                        :label="m(k)"
                        :value="parseInt(v)"
                      ></el-option>
                    </el-select>

                    <span v-else>{{
                      m(deliveryTypeOptions[protInfo.deliveryType])
                    }}</span>
                  </el-form-item>
                </el-col>
                <el-col :md="12" :lg="8">
                  <el-form-item prop="flightNumber">
                    <div slot="label">最后免仓期(LFD):</div>
                    <el-date-picker
                      v-if="isChangeProtInfo"
                      v-model="protInfo.lastFreeDayTime"
                      type="date"
                      value-format="yyyy-MM-dd HH:mm:ss"
                      placeholder="选择日期"
                      :style="{ width: '100%' }"
                      :picker-options="pickerOptions"
                    >
                      >
                    </el-date-picker>
                    <span v-else>{{ protInfo.lastFreeDayTime }}</span>
                  </el-form-item>
                </el-col>
              </el-row>
            </el-form>
          </el-card>
        </el-col>
      </el-row>
    </el-card>
  </div>
</template>

<script>
import { ajax } from "@/store/yg/common/utils";
import * as constant from "@/store/yg/common/constant";
import axios from "axios";
import { m } from "@/store/yg/common/local";

export default {
  props: {
    verifyShow: {
      type: Object,
      default: function() {
        return {};
      }
    },
    pageType: {
      type: String,
      required: true
    },
    waybillData: {}
  },
  data() {
    return {
      stockInfo: {},
      waybillId: 0,
      palceOrderWayOptions: {
        0: "清关+派送",
        1: "清关",
        2: "快递派送",
        3: "卡车派送"
      },
      shippingway: 0,
      isChangeChannelInfo: false,
      isChangeOutStockInfo: false,
      isChangeProtInfo: false,
      channelInfo: {},
      outStockInfo: {},
      isNotOptions: {
        1: "是",
        0: "否"
      },

      protInfo: {},
      //渠道下拉
      stockChannelOptions: {},
      //国家下拉
      countryOptions: {},
      //港口下拉
      configPortOptions: {},
      //航空公司下拉
      airlineOptions: {},
      //船公司
      configShipOptions: {},
      //服务商
      serviceCompanyOptions: {},
      //币种
      currencyOptions: {},
      // 用户下拉
      userOptions: {},
      //派送方式下拉
      deliveryTypeOptions: {},
      pickerOptions: {
        // disabledDate(time) {
        //   return time.getTime() > Date.now();
        // },
        shortcuts: [
          {
            text: "今天",
            onClick(picker) {
              picker.$emit("pick", new Date());
            }
          },
          {
            text: "昨天",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24);
              picker.$emit("pick", date);
            }
          },
          {
            text: "一周前",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", date);
            }
          }
        ]
      }
    };
  },
  mounted() {
    this.waybillId = this.$route.query.waybillId;
    this.shippingway = this.$route.query.shippingway;
    this.initParams();
    this.initOptions();
  },
  methods: {
    initParams() {
      var consProtInfo = {};
      consProtInfo.id = this.waybillData.id;
      consProtInfo.masterNumber = this.waybillData.masterNumber;
      consProtInfo.estimatedDepartureTime = this.waybillData.estimatedDepartureTime;
      consProtInfo.estimatedArrivalTime = this.waybillData.estimatedArrivalTime;
      consProtInfo.serviceCompanyId = this.waybillData.serviceCompanyId;
      consProtInfo.customsClearanceAgent = this.waybillData.customsClearanceAgent;
      consProtInfo.afterSendServicer = this.waybillData.afterSendServicer;
      consProtInfo.shipmentPort = this.waybillData.shipmentPort;
      consProtInfo.departurePortInspectionTime = this.waybillData.departurePortInspectionTime;
      consProtInfo.departurePortInspectionReason = this.waybillData.departurePortInspectionReason;
      consProtInfo.destinationPort = this.waybillData.destinationPort;
      consProtInfo.arrivalPortInspectionTime = this.waybillData.arrivalPortInspectionTime;
      consProtInfo.arrivalPortInspectionReason = this.waybillData.arrivalPortInspectionReason;
      consProtInfo.transferPort = this.waybillData.transferPort;
      consProtInfo.transferPortInspectionTime = this.waybillData.transferPortInspectionTime;
      consProtInfo.transferPortInspectionReason = this.waybillData.transferPortInspectionReason;
      consProtInfo.shipOrAirlineCompany = this.waybillData.shipOrAirlineCompany;
      consProtInfo.flightNumber = this.waybillData.flightNumber;
      consProtInfo.shipOrAirlineCompany = this.waybillData.shipOrAirlineCompany;
      consProtInfo.bigShip = this.waybillData.bigShip;
      consProtInfo.shipFlights = this.waybillData.shipFlights;
      consProtInfo.shipImo = this.waybillData.shipImo;
      consProtInfo.wharfName = this.waybillData.wharfName;
      consProtInfo.deliveryType = this.waybillData.deliveryType;
      consProtInfo.portOfDestinationWay = this.waybillData.portOfDestinationWay;
      consProtInfo.boardNo = this.waybillData.boardNo;
      consProtInfo.lastFreeDayTime = this.waybillData.lastFreeDayTime;
      consProtInfo.customerRemark = this.waybillData.customerRemark;
      consProtInfo.customerRemark2 = this.waybillData.customerRemark2;
      consProtInfo.operationRemark=this.waybillData.operationRemark;
      this.protInfo = consProtInfo;
      //只对部分赋值
      var constantChannelInfo = {};
      constantChannelInfo.id = this.waybillData.id;
      constantChannelInfo.masterNumber = this.waybillData.masterNumber;
      constantChannelInfo.palceOrderWay = this.waybillData.palceOrderWay;
      constantChannelInfo.countryId = this.waybillData.countryId;
      constantChannelInfo.inStockActualWeight = this.waybillData.inStockActualWeight;
      constantChannelInfo.inStockVolume = this.waybillData.inStockVolume;
      constantChannelInfo.inStockChargedWeight = this.waybillData.inStockChargedWeight;
      constantChannelInfo.inStockTotalPackages = this.waybillData.inStockTotalPackages;
      this.channelInfo = constantChannelInfo;

      var conStockInfo = {};
      conStockInfo.id = this.waybillData.id;
      conStockInfo.inStockTotalPackages = this.waybillData.inStockTotalPackages;
      conStockInfo.inStockActualWeight = this.waybillData.inStockActualWeight;
      conStockInfo.inStockChargedWeight = this.waybillData.inStockChargedWeight;
      conStockInfo.inStockVolume = this.waybillData.inStockVolume;
      this.stockInfo = conStockInfo;

      var constOutStockInfo = {};
      constOutStockInfo.id = this.waybillData.id;
      constOutStockInfo.serviceTotalPackages = this.waybillData.serviceTotalPackages;
      constOutStockInfo.serviceActualWeight = this.waybillData.serviceActualWeight;
      constOutStockInfo.serviceChargedWeight = this.waybillData.serviceChargedWeight;
      constOutStockInfo.serviceVolume = this.waybillData.serviceVolume;
      constOutStockInfo.serviceVolumeWeight = this.waybillData.serviceVolumeWeight;
      constOutStockInfo.serviceUnitPrice = this.waybillData.serviceUnitPrice;
      constOutStockInfo.serviceUnitPriceCurrency = this.waybillData.serviceUnitPriceCurrency;

      this.outStockInfo = constOutStockInfo;
    },
    //语言包方法
    m(k) {
      return m(k);
    },
    //value值找pro属性名
    findKey(value, obj, compare = (a, b) => a === b) {
      return Object.keys(obj).find(k => compare(obj[k], value));
    },
    //初始化下拉
    initOptions() {
      const sources = [
        "countryReverseSource",
        "instockChannelSource",
        "currencySource",
        "serveCompanySource",
        "airlineSource",
        "userSource",
        "shipownerSource",
        "seaWayDeliveryTypeSource"
      ];
      if (["airFreightHD", "airFreight"].includes(this.pageType)) {
        sources.push("configAirPortCodeSource");
      } else if (["seaFreightHD", "seaFreight"].includes(this.pageType)) {
        sources.push("configPortSource");
      }

      sources.forEach(bean => {
        var uri = "/api/entry/source?bean=" + bean;
        axios.post(constant.API_SERVER + uri).then(
          response => {
            if (bean === "countryReverseSource") {
              this.countryOptions = response.data;
            } else if (bean === "instockChannelSource") {
              this.stockChannelOptions = response.data;
            } else if (bean === "currencySource") {
              this.currencyOptions = response.data;
            } else if (bean === "configPortSource") {
              //港口下拉
              this.configPortOptions = response.data;
            } else if (bean === "configAirPortCodeSource") {
              //机场下拉
              this.configPortOptions = response.data;
            } else if (bean === "serveCompanySource") {
              this.serviceCompanyOptions = response.data;
            } else if (bean === "airlineSource") {
              this.airlineOptions = response.data;
            } else if (bean === "userSource") {
              this.userOptions = response.data;
            } else if (bean === "shipownerSource") {
              this.configShipOptions = response.data;
            } else if (bean === "seaWayDeliveryTypeSource") {
              this.deliveryTypeOptions = response.data;
            }
          },
          error => {
            console.info(error);
          }
        );
      });
    },

    //修改保存渠道信息
    changeChannelInfo() {
      if (this.isChangeChannelInfo) {
        this.isChangeChannelInfo = false;
        var params = this.channelInfo;
        params["id"] = this.waybillId;
        this.updateWaybillByMap(params);
      } else {
        this.isChangeChannelInfo = true;
      }
    },
    changeOutOfStockInfo() {
      if (this.isChangeOutStockInfo) {
        this.isChangeOutStockInfo = false;
        var params = this.outStockInfo;
        params["id"] = this.waybillId;
        this.updateWaybillByMap(params);
      } else {
        this.isChangeOutStockInfo = true;
      }
    },
    changeStockInfo() {
      console.log(this.airlineOptions);
      if (this.isChangeProtInfo) {
        this.isChangeProtInfo = false;
        var params = this.protInfo;
        params["id"] = this.waybillId;
        this.updateWaybillByMap(params);
      } else {
        this.isChangeProtInfo = true;
      }
    },

    updateWaybillByMap(param) {
      ajax("updateWaybillByMap", param).then(
        res => {
          if (res.code != 200) {
            if (null != res.message) {
              this.$message.error(m(res.message));
            } else {
              this.$message.error("修改失败!");
            }
          } else {
            this.$message.success("修改成功!");
            if (
              null != param["customsClearanceAgent"] &&
              param["customsClearanceAgent"] != ""
            ) {
              var parmValue = param["customsClearanceAgent"];
              ajax("queryServiceCompanyById", { id: parmValue }).then(
                res => {
                  if (res.code != 200) {
                    this.$message.error(res.message);
                  } else {
                    if (null != res.data) {
                      const html =
                        res.data["companyNameEn"] +
                        "\n" +
                        res.data["companyAddressEn"] +
                        "\n" +
                        "TEL:" +
                        res.data["firstContactPhone"] +
                        "\n" +
                        res.data["vatNumber"];
                      this.waybillData["masterNumberReceiver"] = html;
                      this.waybillData["serachReceiver"] = parmValue;
                      this.waybillData["masterNumberAgent"] = html;
                      this.waybillData["serachAgent"] = parmValue;
                    }
                  }
                },
                error => {
                  console.log(error);
                }
              );
            }
          }
        },
        error => {
          console.log(error);
        }
      );
    },
    companyIdChange() {
      if (
        this.protInfo.serviceCompanyId != null &&
        this.protInfo.serviceCompanyId != ""
      ) {
        axios
          .post(
            constant.API_SERVER +
              "/api/consume/load?uri=/setting/servecompany/list&entryUri=/setting/servecompany/edit&f=get&id=" +
              this.protInfo.serviceCompanyId
          )
          .then(res => {
            let data = res.data;
            this.protInfo.linkMan = data.firstContact;
            this.protInfo.companyPhone = data.firstContactPhone;
          })
          .catch(err => {
            this.$message.error(err);
          });
      } else {
        this.protInfo.linkMan = "";
        this.protInfo.companyPhone = "";
      }
    }
  }
};
</script>

<style lang="scss" scoped>
.main-text {
  span {
    display: inline-block;
    color: #3f4652;
    line-height: 28px;
    font-size: 12px;
  }
}

.form-item-text {
  span {
    height: 28px;
    margin-bottom: 14px;
  }
}
</style>
